<template>
	<view class="container">
		<view class="header">
			<image src="/static/images/my_topbg.png"></image>
			<view class="header_content">
				<view class="user-info">
					<image class="avatar"
						:src="userInfo.business_img ? userInfo.business_img : '/static/images/my_portrait_empty.png'">
					</image>
					<view class="user_content">
						<view class="info">
							<view class="user_title">{{userInfo.business_name}}</view>
							<view class="level-box">
								<view class="user-level">
									{{userInfo.partner_level_name ? userInfo.partner_level_name :'会员'}}
								</view>
								<view class="user-level">
									商家
								</view>
							</view>
						</view>
						<view class="details_content">
							<view class="details_box" @tap="goPage('/pages/equipment/equipment')">
								<view class="box_title">
									所属冰柜(台)
								</view>
								<view class="box_number">
									{{userInfo.freezer_num}}
								</view>
							</view>
						</view>
					</view>

				</view>
				<view class="user_address">
					{{userInfo.province}}{{userInfo.city}}{{userInfo.district}}{{userInfo.address}}
				</view>
				<view class="merchant_sn" v-for="(item,index) in userInfo.freezer_list" :key="index">
					<view class="freezer_sn">冰柜编号：{{item.sn}}</view>
					<view class="freezer_name">冰柜码：{{item.name?item.name:'暂无录入'}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		toLogin
	} from '@/utils/login'
	import {
		businessInfo
	} from '@/api/common.js'
	export default {
		data() {
			return {
				userInfo: {
					freezer_num: 0,
					today_order_amount: '0.00'
				},
				merchant_id: 0,
			}
		},
		onLoad(option) {
			this.merchant_id = option.id;
			this.businessInfo()
		},
		onShow() {
			this.businessInfo()
		},
		methods: {
			businessInfo() {
				let that = this;
				businessInfo({
					business_id: that.merchant_id,
				}).then(res => {
					if (res.code == 1) {
						that.userInfo = res.data
					}
				})
			},
			goPage(url) {
				if (!this.isLogin) return toLogin()
				uni.navigateTo({
					url
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		position: relative;
		width: 100%;

		.header {
			position: relative;
			width: 100%;
			height: 100vh;

			image {
				width: 100%;
				height: 100%;
			}

			.header_content {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				padding: 60rpx 25rpx;

				.user-info {
					display: flex;
					justify-content: flex-start;

					.avatar {
						width: 140rpx;
						height: 140rpx;
						border-radius: 50%;
					}
					.user_content{
						margin-left: 30rpx;
						display: flex;
						justify-content: space-between;
						align-items: center;
						.info {
							display: flex;
							flex-direction: column;
							justify-content: center;
							width: 80%;
							.user_title {
								font-size: 28rpx;
								font-family: PingFang SC;
								font-weight: 500;
								color: #FFFFFF;
								line-height: 48rpx;
							}
						
							.level-box {
								display: flex;
								justify-content: space-around;
								align-items: center;
						
								.user-level {
									margin-top: 20rpx;
									margin-right: 10rpx;
									padding: 0 20rpx;
									height: 40rpx;
									font-size: 24rpx;
									font-family: PingFang SC;
									font-weight: 500;
									color: #FFFFFF;
									text-align: center;
									line-height: 40rpx;
									border: 1px solid #FFFFFF;
									border-radius: 20rpx;
								}
							}
						}
						
						.details_content {
							display: flex;
							justify-content: space-between;
							align-items: center;
							width: 300rpx;
							.details_box {
								width: 100%;
								.box_title {
									height: 54rpx;
									font-size: 24rpx;
									font-family: PingFang SC;
									font-weight: 500;
									text-align: center;
									line-height: 54rpx;
									color: #FFFFFF;
								}
						
								.box_number {
									height: 54rpx;
									font-size: 40rpx;
									font-family: PingFang SC;
									font-weight: bold;
									text-align: center;
									line-height: 54rpx;
									color: #FFFFFF;
								}
							}
						
							.details_border {
								width: 2rpx;
								height: 54rpx;
								background-color: #D59C63;
							}
						}
					}
				}

				.user_address {
					margin-top: 20rpx;
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #FFFFFF;
					line-height: 48rpx;
				}
				.merchant_sn{
					display: flex;
					flex-direction: column;
					justify-content: space-between;
					align-items: flex-start;
					margin-top: 20rpx;
					
					.freezer_sn{
						font-size: 28rpx;
						font-family: PingFang SC;
						font-weight: 500;
						color: #FFFFFF;
						line-height: 48rpx;
					}
					.freezer_name{
						font-size: 28rpx;
						font-family: PingFang SC;
						font-weight: 500;
						color: #FFFFFF;
						line-height: 48rpx;
					}
				}

			}
		}

		.content {
			position: absolute;
			top: 80%;
			left: 0;
			width: 100%;
			padding: 0 25rpx;

			.seckill {
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin-bottom: 20rpx;
				height: 88rpx;
				padding: 30rpx 20rpx;
				background: #FFFFFF;
				border-radius: 10rpx;

				.seckill_title {
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #1E1F25;
					line-height: 48rpx;
				}
			}

			.list_shop {
				margin-bottom: 20rpx;
				padding: 0 30rpx;
				background: #FFFFFF;
				border-radius: 10rpx;

				.shop_head {
					display: flex;
					justify-content: space-between;
					align-items: center;
					padding: 30rpx 0;

					.head_address {
						display: flex;
						justify-content: flex-start;
						align-items: center;

						image {
							width: 44rpx;
							height: 40rpx;
						}

						.head_title {
							margin-left: 10rpx;
							font-size: 28rpx;
							font-family: PingFang SC;
							font-weight: 500;
							color: #0F0F0F;
							line-height: 54rpx;
						}
					}

					.head_date {
						font-size: 24rpx;
						font-family: PingFang SC;
						font-weight: 500;
						color: #4D4D4D;
						line-height: 54rpx;
					}
				}

				.shop_line {
					height: 1px;
					background: #E3E3E3;
				}

				.shop_content {
					overflow: hidden;
					display: flex;
					justify-content: space-between;
					align-items: center;
					padding: 30rpx 0;

					.shop_box {
						display: flex;
						justify-content: space-between;
						align-items: center;

						image {
							margin-right: 50rpx;
							width: 150rpx;
							height: 150rpx;
						}
					}

					image {
						width: 40rpx;
						height: 10rpx;
					}
				}

				.shop_footer {
					display: flex;
					justify-content: space-between;
					align-items: center;
					padding: 30rpx 0;

					.footer_text {
						font-size: 24rpx;
						font-family: PingFang SC;
						font-weight: 500;
						color: #4D4D4D;
						line-height: 40rpx;

						.text_red {
							font-size: 32rpx;
							font-family: PingFang SC;
							font-weight: 500;
							color: #EA4445;
							line-height: 40px;
						}
					}

					.footer_btn {
						width: 140rpx;
						height: 48rpx;
						font-size: 24rpx;
						font-family: PingFang SC;
						font-weight: 500;
						text-align: center;
						color: #FFFFFF;
						line-height: 48rpx;
						background: #EA4445;
						border-radius: 24rpx;
					}
				}
			}
		}
	}
</style>